function get_id(id_name) {
	var box = document.querySelector(id_name),
		ul = box.querySelector('ul'),
		ulis = ul.querySelectorAll('li'),
		ol = box.querySelector('ol'),
		olis = ol.getElementsByTagName('li'),
		left_arrow = box.querySelector('.left_arrow'),
		right_arrow = box.querySelector('.right_arrow'),
		now_index = 0,
		last_index = 0,
		onoff = false,
		new_li;

	//动态生成控制圆点
	for(var i = 0; i < ulis.length; i++) {
		new_li = document.createElement('li');
		ol.appendChild(new_li);
	}
	olis[0].classList.add('active');
	//右
	right_arrow.addEventListener('click', function() {
		if(!onoff) {
			onoff = true;
			++now_index >= ulis.length ? right_run(now_index) : run(now_index);
		}
	});
	//左
	left_arrow.addEventListener('click', function() {
		if(!onoff) {
			onoff = true;
			--now_index < 0 ? left_run(now_index) : run(now_index);
		}
	});
	//主函数
	function run(target_index) {
		ul.style.transform = "translateX(-" + target_index * 100 + "%)";
		olis[last_index].classList.remove('active');
		olis[target_index].classList.add('active');
		last_index = target_index;
		ul.addEventListener('transitionend', function() {
			onoff = false;
		});
	}
	//右无缝
	function right_run(target_index) {
		//1.克隆第一张图片
		new_li = ulis[0].cloneNode(true);
		//2.将克隆的图片放到最后
		ul.appendChild(new_li);
		//3.执行轮播时的动画
		ul.style.transform = "translateX(-" + target_index * 100 + "%)";
		//4.动画结束后将视图位置调到第一位
		ul.addEventListener('transitionend', right_run_end);
		//5.删除类名
		olis[last_index].classList.remove('active');
		last_index = 0;
		now_index = 0;
		//6.加类名
		olis[now_index].classList.add('active');
		//动作结束之前要做的事↓↓
		function right_run_end() {
			//去除过度动画
			ul.style.transition = 'none';
			//让视图瞬间回到第一位
			ul.style.transform = 'translateX(0%)';
			//获取上面最终的样式，不然的话下面的会把上面的覆盖掉
			getComputedStyle(ul).transition;
			//用回原来的transition
			ul.style.transition = '';
			//删除克隆的图片
			new_li.remove();
			//关闭开关
			onoff = false;
			//解绑
			ul.removeEventListener('transitionend', right_run_end);
		}
	}
	//左无缝
	function left_run(target_index) {
		//1.克隆最后一张图片
		new_li = ulis[ulis.length - 1].cloneNode(true);
		//2.去除过度动画
		ul.style.transition = 'none';
		//3.将克隆的图片放到最前
		ul.insertBefore(new_li, ulis[0]);
		//4.移动视图位置
		ul.style.transform = 'translateX(-100%)';
		//温馨提示
		getComputedStyle(ul).width;
		//5.加回过度动画
		ul.style.transition = '';
		//6.将视图位置移动到0%
		ul.style.transform = 'translateX(0%)';
		//7.动画结束后将视图位置调到最后一位
		ul.addEventListener('transitionend', left_run_end);
		//8.删除类名
		olis[last_index].classList.remove('active');
		last_index = olis.length - 1;
		now_index = olis.length - 1;
		//9.加类名
		olis[now_index].classList.add('active');
		//动作结束之前要做的事↓↓
		function left_run_end() {
			//去除过度动画
			ul.style.transition = 'none';
			//将视图位置调到最后
			ul.style.transform = 'translateX(-' + (ulis.length - 1) + '00%)';
			//温馨提示
			getComputedStyle(ul).width;
			//用回原来的transition
			ul.style.transition = '';
			//删除克隆的图片
			new_li.remove();
			//关闭开关
			onoff = false;
			//解绑
			ul.removeEventListener('transitionend', left_run_end);
		}
	}
	//鼠标停留时轮播暂停，鼠标离开时轮播继续。
	box.addEventListener('mouseover', function() {
		clearInterval(timer);
	})
	box.addEventListener('mouseout', function() {
		auto_play();
	})
	//自动轮播函数
	function auto_play() {
		timer = setInterval(function() {
			if(!onoff) {
				onoff = true;
				++now_index >= ulis.length ? right_run(now_index) : run(now_index);
			}
		}, 1500);
	}
	auto_play();
	//圆点控制之闭包!!!!!
	for(var i = 0; i < olis.length; i++) {
		(function(j) {
			olis[j].addEventListener('click', function() {
				if(last_index != j) {
					now_index = j;
					run(j);
				}
			});
		})(i)
	}
}

get_id('#carousel_box1');
get_id('#carousel_box2');